什么是 Hexo?
Hexo 是一个快速、简洁且高效的博客框架。Hexo 使用 Markdown(或其他渲染引擎)解析文章,在几秒内,即可利用靓丽的主题生成静态网页。
官方文档
(这里主要记录本人在使用Hexo过程中遇到的问题和解决方案)
基本使用
init
| 1 | $ hexo init [folder] | 
新建一个网站。如果没有设置 folder ,Hexo 默认在目前的文件夹建立网站。
new
| 1 | $ hexo new [layout] <title> | 
新建一篇文章。如果没有设置 layout 的话,默认使用 _config.yml 中的 default_layout 参数代替。如果标题包含空格的话,请使用引号括起来。
| 1 | $ hexo new "post title with whitespace" | 
generate
| 1 | $ hexo generate | 
生成静态文件。
| 选项 | 描述 | 
|---|---|
| -d,--deploy | 文件生成后立即部署网站 | 
| -w,--watch | 监视文件变动 | 
该命令可以简写为1
$ hexo g
publish
| 1 | $ hexo publish [layout] <filename> | 
发表草稿。
server
| 1 | $ hexo server | 
启动服务器。默认情况下,访问网址为: http://localhost:4000/。
| 选项 | 描述 | 
|---|---|
| -p,--port | 重设端口 | 
| -s,--static | 只使用静态文件 | 
| -l,--log | 启动日记记录,使用覆盖记录格式 | 
该命令可以简写为1
2
3
4
5
6
7$ hexo s
`
## deploy
``` bash
$ hexo deploy
部署网站。
| 参数 | 描述 | 
|---|---|
| -g,--generate | 部署之前预先生成静态文件 | 
该命令可以简写为:1
$ hexo d
render
| 1 | $ hexo render <file1> [file2] ... | 
渲染文件。
| 参数 | 描述 | 
|---|---|
| -o,--output | 设置输出路径 | 
migrate
| 1 | $ hexo migrate <type> | 
从其他博客系统 迁移内容。
clean
| 1 | $ hexo clean | 
清除缓存文件 (db.json) 和已生成的静态文件 (public)。
在某些情况(尤其是更换主题后),如果发现您对站点的更改无论如何也不生效,您可能需要运行该命令。
list
| 1 | $ hexo list <type> | 
列出网站资料。
version
| 1 | $ hexo version | 
插件
Hexo-admin
插件介绍
hexo-admin 是一个Hexo博客引擎的管理用户界面插件。这个插件最初是作为本地编辑器设计的,在本地运行hexo使用hexo-admin编写文章,然后通过hexo g或hexo d(hexo g是本地渲染,hexo d是将渲染的静态页面发布到GitHub)将生成的静态页面发布到GitHub等静态服务器。如果你使用的是非静态托管服务器,比如自己买的主机搭建的hexo,那么一定要设置hexo-admin 的密码,否则谁都可以编辑你的文章。
插件安装
首先进入hexo创建的博客项目的根目录下,执行
| 1 | npm install --save hexo-admin | 
打开 http://localhost:4000/admin/ 就可以访问到hexo-admin管理页面了。
密码保护
打开setting,点击Setup authentification here输入用户名,密码,密钥,下面会自动生成配置文件,复制加在hexo根目录下的_config.yml中:
| 1 | admin: | 
重启hexo,就可以看到登录页面了
发布文章
进入后台之后点击Deploy,里面的Deploy按钮是用来执行发布脚本的,所以我们先在博客根目录下新建个目录admin_script,然后在目录中新建一个脚本hexo-g.sh,里面写下下面代码然后保存.
| 1 | hexo g && hexo d | 
然后在_config.yml中的admin下添加
| 1 | admin: | 
设置发布执行的脚本,点击Deploy就会执行这个命令并提交到GitHub上。
Hexo给NexT主题内添加页面点击出现爱心的效果
- 创建js文件
在/themes/next/source/js下新建文件clicklove.js,接着把下面的代码拷贝粘贴到clicklove.js文件中。
| 1 | !function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: fixed;}.heart:after{top: -5px;}.heart:before{left: -5px;}"),o(),r()}function r(){for(var e=0;e<d.length;e++)d[e].alpha<=0?(t.body.removeChild(d[e].el),d.splice(e,1)):(d[e].y--,d[e].scale+=.004,d[e].alpha-=.013,d[e].el.style.cssText="left:"+d[e].x+"px;top:"+d[e].y+"px;opacity:"+d[e].alpha+";transform:scale("+d[e].scale+","+d[e].scale+") rotate(45deg);background:"+d[e].color+";z-index:99999");requestAnimationFrame(r)}function o(){var t="function"==typeof e.onclick&&e.onclick;e.onclick=function(e){t&&t(),i(e)}}function i(e){var a=t.createElement("div");a.className="heart",d.push({el:a,x:e.clientX-5,y:e.clientY-5,scale:1,alpha:1,color:s()}),t.body.appendChild(a)}function c(e){var a=t.createElement("style");a.type="text/css";try{a.appendChild(t.createTextNode(e))}catch(t){a.styleSheet.cssText=e}t.getElementsByTagName("head")[0].appendChild(a)}function s(){return"rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"}var d=[];e.requestAnimationFrame=function(){return e.requestAnimationFrame||e.webkitRequestAnimationFrame||e.mozRequestAnimationFrame||e.oRequestAnimationFrame||e.msRequestAnimationFrame||function(e){setTimeout(e,1e3/60)}}(),n()}(window,document); | 
- 修改_layout.swig
在\themes\next\layout_layout.swig文件末尾添加:
| 1 | <!-- 页面点击小红心 --> |